<template>
  <div class="svaenticeDetail">
    <div class="PageQuery" v-show="setstate===0">
      <div class="content" v-show="showFlag ">
        <div class="title">行政处罚决定书</div>
        <div class="space">
          <span>当事人:</span><span v-html="result.salutation"></span>
        </div>
        <div class="space">
          <span>处罚金额:</span><span v-html="result.amerce"></span>元
        </div>
        <div class="space">
          <span>案件编号:</span><span v-html="result.caseCode"></span>
        </div>
        <div class="space">
          <span>违法原因:</span><span v-html="result.illegality"></span>
        </div>
      </div>
      <loading v-show="!showFlag"></loading>
    </div>
    <div class="PageQuery" v-show="setstate===1">
      <div class="content" v-show="showFlag ">
        <div class="title">行政处罚通知书</div>
        <div class="space">
          <span>当事人:</span> <span v-html="result.party"></span>
        </div>
        <div class="space">
          <span>处罚金额:</span> <span v-html="result.penaltyAmount"></span>元
        </div>
        <div class="space">
          <span>案件编号:</span> <span v-html="result.caseCode"></span>
        </div>

        <div class="space">
          <span>违法原因:</span> <span v-html="result.factsAndEvidence"></span>
        </div>
      </div>
      <loading v-show="!showFlag"></loading>
    </div>
  </div>

</template>
<script type="text/ecmascript-6">
  import http from '../util/https'
  import {baseurl} from '../base/config'
  import {mapGetters} from "vuex"
  import loading from './loading'

  export default {
    name: "svaenticeDetail",
    data() {
      return {
        result: "",
        showFlag: false,
      }
    },
    components: {
      loading
    },
    created() {
      document.title = "行政处罚决定书";
      this.getData();
      // console.log(this.setuser)
    },
    computed: {
      ...mapGetters(['setuser', "setstate"])
    },
    methods: {
      // back() {
      //   this.$router.push({
      //     name: "svaenotice"
      //   });
      // console.log(1)
      //},
      getData: async function () {
        // if (!this.this.setuser.code) {
        //   this.$router.push({
        //     name: "svaenotice"
        //   })
        // }｝
        const url = baseurl + "/caseQuery/getAgreementText";
        let params = {
          type: this.setstate,
          code: this.setuser.code
        };
        const res = await http.get(url, params);
        if (res.data.code === 0) {
          this.showFlag = true;
          this.result = res.data.data

        }
        console.log(res)
      }
    }
  }
</script>
<style scoped type="text/less" lang="less">

  .svaenticeDetail {
    .slide-enter-active, .slide-leave-active {
      transition: all 0.3s
    }

    .slide-enter, .slide-leave-to {
      transform: translate3d(100%, 0, 0)
    }

    .icon {
      font-size: .48rem;
      color: #449d44;
      position: fixed;
      left: .5rem;
      top: .5rem;

      span {
        font-size: .45rem;
      }
    }
    position: relative;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    z-index: 2000;
    /*background: #449d44;*/
    .PageQuery {
      position: relative;

      .title {
        text-align: center;
        font-size: .4rem;
        margin: .5rem auto;
        color: #449d44;

      }
      .content {
        /*margin-top: .5rem;*/
        font-size: .3rem;
        /*margin: 0 .5rem;*/
        line-height: .8rem;
        /*margin-bottom: 1rem;*/
        margin: .5rem .5rem 1rem .5rem;
        .space {
          line-height: .7rem;
          font-size: .25rem;
        }
      }
      .noresult {
        text-align: center;
        font-size: .35rem;
        height: 10rem;
        line-height: 10rem;
      }

      .btncont {
        text-align: center;
        margin: .5rem 0;
        .btn-success {
          width: 2rem;
          height: .8rem;
          background: #449d44;
          color: #fff;
          outline: none;
          border: none;
          border-radius: .15rem;
          font-size: .3rem;
        }
      }

    }

  }

  .slide-enter-active, .slide-leave-active {
    transition: all 0.3s
  }

  .slide-enter, .slide-leave-to {
    transform: translate3d(100%, 0, 0)
  }


</style>
